前言

因官方尚未支援，目前尚無法使用上一章節包含 HTML 語法的字串資源於 Compose UI。

• strings.xml

  <string name="hello"> Hello </string>
  <string name="world"> world ! </string>
  

• MainActivity.kt

  override fun onCreate(savedInstanceState: Bundle?) {
  super.onCreate(savedInstanceState)
  setContent {
      Box(
          modifier = Modifier
              .fillMaxSize(),
          contentAlignment = Alignment.Center
      ) {
          Text(
              //==================呼叫字串資源===================
              text = getString(R.string.hello_world)
              //===============================================
          )
      }
  ...
  

• 啟動專案：呈現文字並未符合HTML樣式
  

Compose UI 設定字串資源樣式

• strings.xml
  將不同樣式設定的字串拆分為各別獨立字串：

  <string name="hello"> Hello </string>
  <string name="world"> world ! </string>
  

• Compose UI 內設定樣式
  • 設定樣式：SpanStyle(屬性內容) 設定文字樣式。SpanStyle(fontWeight = FontWeight.Bold)即設定文字為粗體。
  • 套用樣式：

    buildAnnotatedString {
        withStyle(style = 樣式A) {
            append(字串內容A)
        }
        withStyle(style = 樣式B) {
            append(字串內容B)
        }
        ...
    }
    

• MainActivity.kt

  override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)
  
      //========== 使用 buildAnnotatedString 設定樣式 ==========
      val boldStyle = SpanStyle(fontWeight = FontWeight.Bold) 
      val annotatedString = buildAnnotatedString {
          withStyle(style = boldStyle) {
              append(getString(R.string.hello))
          }
          append(getString(R.string.world))
      }
      //=======================================================
  
      setContent {
          Box(
              modifier = Modifier
                  .fillMaxSize(),
              contentAlignment = Alignment.Center
          ) {
              Text(
                  //======== 設定 text 屬性值 ==========
                  text = annotatedString
                  //==================================
  

• 啟動專案：文字樣式符合預期呈現